<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="en">
<head>
<title>${fns:getConfig('productName')}</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="description" content="description about your site" />
<link rel="shortcut icon" href="${static}/assets/img/favicon.html">

<!-- CSS Files -->
<link rel="stylesheet" type="text/css" href="${static}/assets/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="${static}/assets/css/font-awesome.min.css" />
<link rel="stylesheet" type="text/css" href="${static}/assets/css/animate/animate.css" />
<link rel="stylesheet" type="text/css" href="${static}/assets/css/ionicons.min.css" />
<link rel="stylesheet" type="text/css" href="${static}/assets/css/style.css" />
<link rel="stylesheet" type="text/css" href="${static}/bootstrapvalidator/css/bootstrapValidator.min.css" />
<link rel="stylesheet" type="text/css" href="${static}/jquery-jbox/2.3/Skins/Blue/jbox.css" />
<!-- End CSS Files -->
<script type="text/javascript" src="${static}/jquery/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="${static}/jquery-jbox/2.3/jquery.jBox-2.3.min.js"></script>
</head>

<body class="register">
	<!-- 提示信息 -->
	<sys:message content="${message}" type="error" />
	<div class="container">
		<div class="row">
			<div class="col-sm-6 col-sm-offset-3 col-md-4 col-md-offset-4">
				<div class="form-container">
					<div class="top-wrapper">
						<div class="avatar-container">
							<img src="${static}/assets/img/people/1.jpg" id="avatar" class="avatar animated bounceIn" alt="avatar">
						</div>
					</div>
					<div class="bottom-wrapper">
						<form id="register-form" class="register-form" role="form" action="${web}/register/?u=${urlString}" method="post">
							<!-- <div class="form-group has-feedback">
								<input type="text" class="form-control" placeholder="Enter first name"> <span class="fa fa-user form-control-feedback"></span>
							</div>
							<div class="form-group has-feedback">
								<input type="text" class="form-control" placeholder="Enter last name"> <span class="fa fa-user form-control-feedback"></span>
							</div> -->
							<!-- <div class="form-group has-feedback">
								<input type="text" class="form-control" placeholder="用户名" name="username"> <span class="fa fa-user form-control-feedback"></span>
							</div> -->
							<div class="form-group has-feedback">
								<input id="emailInput" type="text" class="form-control" placeholder="邮箱" name="email" isExists=""> <span class="fa fa-send form-control-feedback"></span>
							</div>
							<div class="form-group has-feedback">
								<input type="password" class="form-control" placeholder="密码" name="password"> <span class="fa fa-unlock-alt form-control-feedback"></span>
							</div>
							<div class="form-group has-feedback">
								<input type="password" class="form-control" placeholder="重新输入密码" name="repassword"> <span class="fa fa-unlock-alt form-control-feedback"></span>
							</div>
							<div class="form-group">
								<button type="submit" class="btn btn-green btn-block">注册</button>
							</div>
							<div class="form-group">
								<hr>
							</div>
							<div class="form-group text-center">
								<!-- <div>
									<a href="forget.html">忘记密码</a>
								</div> -->
								<div>
									<a href="${web }/login?u=${urlString}">已有账号</a>
								</div>
							</div>
							<div class="form-group">
								<hr>
							</div>

						</form>
					</div>
				</div>
			</div>

		</div>

	</div>

	<!-- Javascripts -->
	<script type="text/javascript" src="${static}/assets/js/Bootstrap/bootstrap.min.js"></script>
	<script type="text/javascript" src="${static}/bootstrapvalidator/js/bootstrapValidator.min.js"></script>
	<script type="text/javascript" src="${static}/bootstrapvalidator/js/language/zh_CN.js"></script>

	<!-- End Javascripts -->
	<script type="text/javascript">
		var ctx = '${ctx}', ctxStatic='${static}';
		var _hmt = _hmt || [];
		$(document).ready(function() {
		    $('#register-form').bootstrapValidator({
		        message: '注册请输入完整信息',
		        fields: {
		        	/* username: {
		                validators: {
		                    notEmpty: {
		                        message: '用户名不能为空'
		                    },
		                    stringLength: {
		                        min: 2,
		                        max:15,
		                        message: '用户名长度为3-15个字符'
		                    },
		                    regexp: {
		                        regexp: /^[a-zA-Z0-9_]+$/,
		                        message: '用户名包含‘字母’，‘数字’，‘_’，‘$’'
		                    }
		                }
		            }, */
		            email: {
		            	 trigger: 'blur',
		            	  validators: {
		                      notEmpty: {
		                          message: '邮箱不能为空'
		                      },
		                      emailAddress: {
		                          message: '不是合法的邮箱地址'
		                      },
		                      remote: {
		                          message: '邮箱已存在',
		                          type: "post",
		                          data: function(validator) {
		                              return {
		                                  email: validator.getFieldElements('email').val()
		                              };
		                              console.log(email);
		                          },
		                          url: '${web}/isExistsEmail'
		                      }
		                  }
		            },
                  password: {
                      validators: {
                          notEmpty: {
                              message: '密码不能为空'
                          },
		                  stringLength: {
		                        min: 6,
		                        max:30,
		                        message: '密码长度为6-30个字符'
		                    },
		                  regexp: {
		                        regexp: /^[a-zA-Z0-9_]+$/,
		                        message: '密码包含‘字母’，‘数字’，‘_’，‘$’'
		                    },
		                   identical: {
		                        field: 'repassword',
		                        message: '密码与重新输入密码不同'
		                   }
                      }
                  },
                  repassword: {
                      validators: {
                          notEmpty: {
                              message: '密码不能为空'
                          },
		                    stringLength: {
		                        min: 6,
		                        max:30,
		                        message: '密码长度为6-30个字符'
		                    },
		                    regexp: {
		                        regexp: /^[a-zA-Z0-9_]+$/,
		                        message: '密码包含‘字母’，‘数字’，‘_’，‘$’'
		                    },
		                    identical: {
		                        field: 'password',
		                        message: '密码与重新输入密码不同'
		                    }
                      }
                  }
		           
		           /*  <c:if test="${isValidateCodeLogin}">
		            ,
		            validateCode: {
		                validators: {
		                    notEmpty: {
		                        message: '请输入验证码'
		                    }
		                }
		            }
		            </c:if> */
		        }
		    });
		    
		   //检验注册邮箱是否已经注册
	 	 /*    $("input[name='email']").blur(function(){
		    	var email = $(this).val();
				$.ajax({
	                 type:"post",
	                 url:"${web}/isExistsEmail",
	                 data:{isExistsEmail:email},
	                 dataType:'json',
	                 async:false,
	                 success:function(data){
	                	 $("input[name='email']").attr('isExists',data);
	                 }
	             });
				console.log($("input:first").attr('isExists')+'ajax-----');
				
		    });  */
		    
		});
	</script>
</body>
</html>
